<template>
  <MarkdownEdit :blog="blog" @save="saveBlog" @cancel="cancelBlog" />
</template>

<script setup>
import { EditBlog, GetBlogDetail } from "@/apis/allAPI/blog"
import MarkdownEdit from "@/components/MarkdownEdit.vue"
import appStore from "@/stores"
import { getCurTime } from "@/utils/time"
import { storeToRefs } from "pinia"
import { onMounted, ref } from "vue"
import { useRouter } from "vue-router"
const props = defineProps({
  id: String,
})

const blog = ref({})
const router = useRouter()
const { isBlogLoading } = storeToRefs(appStore.homeviewStore)
const cancelBlog = () => {
  isBlogLoading.value = false
  router.push("/blogs/reader/" + props.id)
}
const saveBlog = () => {
  blog.value.updated_at = getCurTime()
  EditBlog(props.id, blog.value, cancelBlog, () => {
    isBlogLoading.value = false
  })
}

onMounted(() => {
  GetBlogDetail(props.id, (rData) => {
    blog.value = rData
  })
})
</script>
